在 Heroku 中部署后 CSS 和 JS 无法正常工作
Posted
技术标签:
【中文标题】在 Heroku 中部署后 CSS 和 JS 无法正常工作【英文标题】：CSS and JS not working after deployed in heroku 【发布时间】：2019-07-25 03:25:27 【问题描述】：我使用 laravel 5.7，在本地运行良好，但在我将应用程序部署到生产服务器 (heroku) 后，CSS 和 JS 似乎无法正常工作。我该怎么办？
这是网址“https://arrahnu-demo.herokuapp.com/
<head>
<meta charset="utf-8">
<title>Arrahnu Gadai Indonesia</title>
<meta content="width=device-width, initial-scale=1.0" name="viewport">
<meta content="" name="keywords">
<meta content="" name="description">
<!-- Favicons -->
<link href="asset('/img/favicon.png')" rel="icon">
<link href="asset('/img/apple-touch-icon.png')" rel="apple-touch-icon">
<!-- Google Fonts -->
<link href="https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,700,700i|Raleway:300,400,500,700,800|Montserrat:300,400,700" rel="stylesheet">
<!-- Bootstrap CSS File -->
<link href="asset('/lib/bootstrap/css/bootstrap.css')" rel="stylesheet">
<!-- Libraries CSS Files -->
<link href="asset('/lib/font-awesome/css/font-awesome.min.css')" rel="stylesheet">
<link href="asset('/lib/animate/animate.min.css')" rel="stylesheet">
<link href="asset('/lib/ionicons/css/ionicons.min.css')" rel="stylesheet">
<link href="asset('/lib/owlcarousel/assets/owl.carousel.min.css')" rel="stylesheet">
<link href="asset('/lib/magnific-popup/magnific-popup.css')" rel="stylesheet">
<link href="asset('/lib/ionicons/css/ionicons.min.css')" rel="stylesh">
<!-- Main Stylesheet File -->
<link href="asset('/css/style.css')" rel="stylesheet">
</head>
【问题讨论】：
尝试根据您的运行时环境将相对 URL 替换为绝对 URL。因此，将调用 asset('/css/style.css') 替换为由asset() 帮助程序处理的相对 URL，并使用每个所需文件的绝对 URL。如果在生产中，请执行 https://您的<link>s 正在获取 http 而不是 https。
由于您在 Heroku 上的网站是通过 https 提供的，因此浏览器会阻止混合内容。
【讨论】：
这确实是问题的原因，可以找到解决方案***.com/questions/34378122/…以上是关于在 Heroku 中部署后 CSS 和 JS 无法正常工作的主要内容，如果未能解决你的问题，请参考以下文章
在heroku上部署后无法读取mongo数据库，返回503错误，但它在本地工作
Node.js 和 Heroku 错误：Web 进程在启动后 60 秒内无法绑定到 $PORT