我使用Lumen构建了一个API,并希望使用JavaScript和XMLHttpRequest对象来访问它.但每次我的PUT,GET,POST和DELETE请求都转换为OPTIONS - Request.我阅读了很多有CORS信息的网站.我使用以下内容构建中间件:
class CORSMiddleware
{
public function handle($request, \Closure $next)
{
$response = null;
/* Preflight handle */
if ($request->isMethod('OPTIONS')) {
$response = new Response();
} else {
$response = $next($request);
}
$response->header('Access-Control-Allow-Methods', 'OPTIONS, HEAD, GET, POST, PUT, DELETE');
$response->header('Access-Control-Allow-Headers', $request->header('Access-Control-Request-Headers'));
$response->header('Access-Control-Allow-Origin', '*');
return $response;
}
}
Run Code Online (Sandbox Code Playgroud)
我的客户代码:
var url = "http://localhost:8000/api/user";
var xmlHttpRequest = new XMLHttpRequest();
xmlHttpRequest.open('PUT', url, false);
xmlHttpRequest.send('{"username": "ABC", "password": "ABC","email": "mail@cool.xyz" }');
if (xmlHttpRequest.status == 200) {
console.log(xmlHttpRequest.responseText);
}
Run Code Online (Sandbox Code Playgroud)
我的GET请求信息:
Host: localhost:8000
User-Agent: …Run Code Online (Sandbox Code Playgroud) 我正在处理图像上传 - 基于承诺。在“then”回调中我想 $emit 一个事件。我称之为“成功”。我的 VueDevTools 显示了一个成功事件,但在父组件中永远不会调用“链接”方法。this.$emit('success') 是否有可能在 Promises 中不起作用?
示例代码 - 子组件:
UsersAPI.updateAvatar(this.user.id, data, fileExt).then(res => {
if (res) {
Helpers.callToast(this, 'is-success', this.$root.$t('profile.avatar_upload'))
this.$emit('success')
}
})
Run Code Online (Sandbox Code Playgroud)
示例代码 - 父组件
<Avatar @success="test" :user="user" />
Run Code Online (Sandbox Code Playgroud)
父组件中的“test”方法永远不会被调用,但该事件会在 vue 开发工具中被调用。如果我在 Promise 之前发出事件,我就会得到我想要的结果。
你能帮我吗?亲切的问候