【发布时间】：2020-11-22 10:05:39
【问题描述】：
我正在使用 Laravel Passport 来处理我的 oauth2 登录实现。关注来自Dre Himself 的视频。在本地主机上一切正常，但在登录真实站点时出现问题现在我想将我的应用程序部署到 DigitalOcean，并在设置 nginx、.env 文件、composer、npm、设置护照（php artisan passport:install）和数据库之后使用（php工匠迁移）。在我的登录返回 200 且响应负载为
之前，这一切似乎都运行良好<!DOCTYPE html>\n<html lang=\"en\">\n <head>\n <meta charset=\"utf-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">\n\n <title>Resume Workshop</title>\n\n <!-- Fonts -->\n <link href=\"https://fonts.googleapis.com/css2?family=Montserrat:wght@400;700;900&display=swap\" rel=\"stylesheet\"> \n <link rel=\"stylesheet\" href=\"https://myresumeworkshop.com/css/app.css\">\n </head>\n <body>\n <main id=\"app\"></main>\n <script src=\"https://myresumeworkshop.com/js/app.js\"></script>\n </body>\n</html>\n
不记名访问令牌不是正确响应。有趣的是，当我使用 insomnia 向 /oauth/token 端点发出 post 请求时，它会返回令牌，我可以手动将令牌插入到我的本地存储中，应用程序将完全正常工作。
这是我在后端的登录代码：
public function login(Request $request) {
$http = new \GuzzleHttp\Client;
try {
$response = $http->post(config('services.passport.login_endpoint'), [
'form_params' => [
'grant_type' => 'password',
'client_id' => config('services.passport.client_id'),
'client_secret' => config('services.passport.client_secret'),
'username' => $request->username,
'password' => $request->password,
]
]);
// return json_decode((string) $response->getBody(), true)
return $response->getBody();
}
catch (\GuzzleHttp\Exception\BadResponseException $e) {
if ($e->getCode() === 400) {
return response()->json('Incorrect username or password', $e->getCode());
} else if ($e->getCode() === 401) {
return response()->json('Your credentials are incorrect. Please try again', $e->getCode());
}
return response()->json('Something went wrong on the server.', $e->getCode());
}
}
还有我在前端的代码：
retrieveToken(context, data) {
return new Promise((resolve, reject) => {
axios
.post("/login", {
username: data.username,
password: data.password
})
.then(response => {
const token = response.data.access_token;
localStorage.setItem("access_token", token);
context.commit('retrieveToken', token);
resolve(response);
}).catch(error => {
// console.log(error)
reject(error)
});
})
}
当我 console.log response.data 时，它会像上面一样输出 !doctype html。我怀疑这可能是由于 Guzzle 客户端标头内容类型：text/html 而不是 application/json。或者这可能是由于我的 nginx 配置。
这里是来自 guzzle post 请求的 $response 的死和转储
GuzzleHttp\Psr7\Response {#334
-reasonPhrase: "OK"
-statusCode: 200
-headers: array:6 [
"Server" => array:1 [
0 => "nginx/1.14.0 (Ubuntu)"
]
"Content-Type" => array:1 [
0 => "text/html; charset=UTF-8"
]
"Connection" => array:1 [
0 => "close"
]
"Cache-Control" => array:1 [
0 => "no-cache, private"
]
"Date" => array:1 [
0 => "Sat, 01 Aug 2020 22:45:37 GMT"
]
"Set-Cookie" => array:3 [
0 => "XSRF-TOKEN=eyJpdiI6IlNlWWU4NzA2Q0ZLcFdQeWR0dHlra2c9PSIsInZhbHVlIjoiNTZWSlRmUk80UzViV2FXSVFPRGlmTHdGXC9kVmNxRG1oRHNwcllyNHhqOXNOZk0zTloxYlZ3bkwrbG03eTF1SkUiLCJtYWMiOiIyOTIyZWY5ODMyNTNiMDc5Y2JiOTI4ZDEwYjM0YTczYzcxNzgyZWJiYTA1NjM2YzM3MTBhN2U1MTEwZWE5ZjM5In0%3D; expires=Sun, 02-Aug-2020 00:45:37 GMT; Max-Age=7200; path=/"
1 => "resume_workshop_session=eyJpdiI6InlkWTlHWnBqVXZnOFwvRndUOGduQWV3PT0iLCJ2YWx1ZSI6IlRpaXlaTmJzZUl2MlVvRlBFakhVK0FIeDV3K0xXMnlVWmpVUTNjWDBHbFJ1UkNVbWZQSTVxcXg3RHNvZUF0NXYiLCJtYWMiOiJlNTI2YjQyNjRjMGZhODNhNjhkNjdhOWQ1MzQ5YWY2MmNlZTAwODk3M2NiYmI5YTJiNDQxMDUxNWQ3NzNiZmY3In0%3D; expires=Sun, 02-Aug-2020 00:45:37 GMT; Max-Age=7200; path=/; httponly"
2 => "LfsxdWN0U7YDplqYkRiAHeaRYayLUBKvUToCvfV3=eyJpdiI6IkdEU1NVVnk5VE9ESzNvNjNGTTYwdUE9PSIsInZhbHVlIjoidEZ3WjR5dDdSR0Zya1Z5UkpnVk5JU3FVWWJCczhXOHkxd0dud0FpVDhkK29cL2NKemNZNTAwS1N6alpxSm0yNU13bGRFREhRS3BnSWd6RDZFc05MNXJsN3FFWktNTjBzcjkyVHVHS1hNN0NuZEZvZFZVak85SUQrRWRPaFRQK3BtYTc1YU4wOHlVbmlkdnNrWGVYcUhQcmRPbjExXC8rUldyTFwvMFwvVUltaGk3QzZcL1d0RVA1SVFIbzgxVmZVSjE5SnFJazZqd1d4Z000QjB4MWxLVThJd1FYQjN2QTlCeGp3WjZIRlpFd0VHU3ZcL3p3N2lsRXdOOGhuXC9iUWJMd3Nmb0FwaENIOW1qTVU5dWJWZkVTXC9oeXoxRUpTODRxT3hmcExoWW85cG9DOGFGaDNyUmxRdDJGYlpBbkNpZXNSbGNIYlNZbTN4REhjREkrV0doK0c5Vk1kWW82RERCN1NDRlhWcFBLVU5tWDdXdGM9IiwibWFjIjoiMmRhYzlhZGVhZWIwMGVmZDdiYTJiNWUwYTAwNDQ0MTgxMTY1ZDY2MmU5MWE0MWE5ODA5ZGJlNWIyYjE2NzY5MSJ9; expires=Sun, 02-Aug-2020 00:45:37 GMT; Max-Age=7200; path=/; httponly"
]
]
-headerNames: array:6 [
"server" => "Server"
"content-type" => "Content-Type"
"connection" => "Connection"
"cache-control" => "Cache-Control"
"date" => "Date"
"set-cookie" => "Set-Cookie"
]
-protocol: "1.1"
-stream: GuzzleHttp\Psr7\Stream {#333
-stream: stream resource @26
wrapper_type: "PHP"
stream_type: "TEMP"
mode: "w+b"
unread_bytes: 0
seekable: true
uri: "php://temp"
options: []
}
-size: null
-seekable: true
-readable: true
-writable: true
-uri: "php://temp"
-customMetadata: []
}
}
【问题讨论】：
-
快速提问，你有没有设置 axios 标头？内容类型（并接受应用程序/json）？
-
您好，根据您的建议，我尝试了它，但仍然没有运气。 axios.defaults.headers.post['Content-type'] = 'application/json'; axios.defaults.headers.post['Accept'] = 'application/json';我把这个放在发布请求之前
-
我想知道您的 CORS 配置是否在您的新服务器中正确。
-
@user3532758 我的 guzzle 请求不会超出我自己的域，但以防万一......任何想法/链接可以正确配置？
标签： laravel vue.js nginx oauth-2.0 guzzle