api header加 authorization之后 跨域

加入 Authorization 头后出现跨域问题可能是因为在服务器端没有正确配置跨域设置。在处理跨域请求时，服务器需要设置响应头 Access-Control-Allow-Origin 来允许跨域请求。你可以在服务器端的接口代码中添加以下响应头：

response.headers['Access-Control-Allow-Origin'] = '*'

其中 '*' 表示允许任何来源（包括跨域请求）的访问。如果你想限制来源，可以将 * 替换为特定的来源地址。

此外，你还需要设置其他跨域相关的响应头，例如 Access-Control-Allow-Methods、Access-Control-Allow-Headers 等。具体设置可以参考跨域请求相关的文档和教程。

相关问题

tp5个别api跨域

在ThinkPHP5框架中，处理API跨域通常涉及到设置响应头的问题。由于浏览器的安全策略（同源策略），默认情况下，一个网页的JavaScript只能向与其相同的协议、域名和端口发送AJAX请求。如果需要访问其他域下的API，可以采取以下几种方法：

1. **全局配置**:
在`config.php`文件中的`app_url`选项里添加允许跨域的前缀，如 `http://example.com/api`。然后在服务器上配置返回正确的`Access-Control-Allow-Origin`头部，允许来自指定来源的请求。

'app_url' => 'http://example.com/api',

2. **控制器层面处理**:
在API对应的Controller类中，通过`response()`方法手动设置响应头，比如：

use think\response\Response;

header('Access-Control-Allow-Origin: *'); // 允许所有来源
header('Access-Control-Allow-Methods: GET, POST');
// 如果有需要，还可以设置其他头信息，如：
header('Access-Control-Allow-Headers: Authorization, Content-Type');
return Response::create($data, 200)->send();

3. **中间件支持**:
如果项目中使用了自定义中间件，可以在中间件中处理跨域问题。例如创建一个专门用于处理跨域的中间件`CrossDomainMiddleware`。

4. **使用JSONP**:
对于不支持CORS的旧版浏览器，可以尝试使用JSONP技术，但这种方式安全性较差，且只适用于GET请求。

记得在生产环境中，为了安全考虑，应仅允许必要的域名访问，并限制特定的HTTP方法。

vue解决跨域后台更改header

在使用Vue解决跨域问题后，如果需要更改后台的headers，可以通过axios库进行操作。

首先，我们需要安装axios库。在Vue项目的根目录下，打开终端并执行以下命令：

npm install axios

axios提供了一个全局的配置，我们可以通过更改配置来更改请求的headers。在Vue项目的入口文件（通常是main.js）中添加如下代码：

import axios from 'axios';

axios.defaults.headers.common['Authorization'] = 'Bearer token'; // 设置授权头部

// 其他配置

Vue.prototype.$http = axios;

这里的`Authorization`是一个示例，你可以根据后台的要求来更改。`Bearer`表示使用了Bearer Token身份验证方式，token是根据实际情况来填写的。

接下来，在需要发送请求的组件中，可以通过`this.$http`来发送请求，同时，可以通过`this.$http.defaults.headers`来更改headers。例如：

this.$http.defaults.headers.common['Authorization'] = 'New Token'; // 更改授权头部

this.$http.get('/api/data').then(response => {
  // 处理响应
}).catch(error => {
  // 处理错误
});

这样就可以在发送请求前更改headers的内容了。需要注意的是，更改headers的操作是全局的，所以可能会对其他的请求产生影响，需要根据实际情况做出判断。

希望以上回答对您有所帮助！