JavaScript错误：提供的目标来源('https://www.youtube.com/')与收件人窗口的来源('http://localhost/')不匹配

这是一个常见的JavaScript错误，它可以在你的网站开发中出现，尤其是当你尝试从不同的域名加载内容时。当网站通过iframe或window.open()打开其他域名的网页时，浏览器会检查网页的来源，以确保它不会向恶意网站泄露信息，从而保护用户的隐私和安全。

如果从来源与请求的网站不同的网站加载了内容，你就会收到一个类似于“提供的目标来源与收件人窗口的来源不匹配”的错误信息。这个错误通常发生在以下情况下：

• 从不同的域名加载的脚本尝试访问本地存储；
• 通过iframe或window.open()打开其他域名的网页时，网页不允许嵌入；
• 在Ajax请求中尝试跨越不同的域名。

要解决这个问题，你需要确保你的代码能通过浏览器的安全检查，以便在不同的域名之间进行数据交换。以下是一些解决方案：

1. 在响应头中添加CORS Headers

CORS（跨域资源共享）允许不同域名之间共享资源。对于ajax请求，你可以通过在响应头中添加CORS headers，让浏览器知道哪些域名可以在请求时拥有资源访问权限。

术语解释：

1. Access-Control-Allow-Origin : 允许访问该资源的域名。
2. Access-Control-Allow-Credentials : 是否允许发送和接受cookie，当为true：Access-Control-Allow-Origin 一定不能为 '*' 或包含多个域名。

res.setHeader("Access-Control-Allow-Origin", "http://localhost:8080,c.http.somewebsite.com");
res.setHeader("Access-Control-Allow-Credentials", true);

2. 使用服务器代理

在一些情况下，你可以使用服务器代理来解决跨域问题。通过创建一个中间服务器，它可以作为一个代理来从服务器获取请求，并在本地返回响应结果给客户端。这种方式可以保证客户端与服务器的域名相同，避免了跨域问题。

const express = require('express');
const request = require('request');
const app = express();

const apiUrl = 'http://somedomain.com';
app.use('/', (req, res) => {
    const url = apiUrl + req.url;
    req.pipe(request(url)).pipe(res);
});

app.listen(3000, () => {
    console.log('Listening on port 3000!')
});

3. 避免使用iframe和window.open()

在页面中使用iframe和window.open()时，可能会导致跨域问题。这是因为它们向用户提供了另一个域名的内容，并且这些内容可能会包含JavaScript代码，访问当前网站的数据。因此，最好避免使用iframe和window.open()，或者保证你要嵌入的内容与你的网站域名一致。

以上是关于浏览器报错“提供的目标来源与收件人窗口的来源不匹配”的解决方法。通过以上方式，你可以避免跨域问题，并保证代码的安全性和有效性。