将 laravel 项目内静态文件,css、js、images 部署到七牛云 CDN

项目升级,打算把 public 目录下的 css、js、image等文件,上传到七牛云,一直想搞来着,今天又想起来,正好 laravel 也从 5.2 升级到了 5.7,接下来把这边一搞,项目就更加优化了。

接上篇文章:
	使用 qshell 将本地文件同步到七牛云
	https://blog.csdn.net/beyond__devil/article/details/83030702

1>我们通过 qshell 已经可以将本地静态文件,上传到七牛云了,七牛云相关处理:

	1.登录七牛云,打开对象存储,创建一个全新的 '存储空间'。

	2.对新创建的空间进行配置,主要是 '绑定域名' 的配置。因为默认的是有 '测试域名',而测试域名无法用于生产环境,我们需要配置自己的域名。
		域名配置,属于 '融合 CDN',我们需要对熟悉这里的文档:
			https://developer.qiniu.com/fusion

		这里卡了我很久,一直不太明白是什么意思(因为对网络知识的不了解)。配置起来很简单

		假设,我们网站使用的域名是:
			www.kissyou.com

		想要为七牛云配置一直加速域名(我们创建的七牛云的域名类型为:普通域名):
			qiniu.kissyou.com

		我们在 '创建域名->加速域名' 这里,填写的就是 'qiniu.kissyou.com',然后完成其他配置,点击 '创建',就新建了一个域名。同时会得到一个 'CNAME',下面会用到

		然后,我们登录我们的 '域名服务商',我用的 '阿里云',登录后,给该域名下,添加一个 'qiniu.kissyou.com' 的解析。这个解析和平常我们的网站解析不一样,使用的记录类型是 'CNAME'。

		添加解析记录:
			记录类型 - CNAME
			主机记录 - qiniu
			解析线路 - 默认
			记录值 - 我们上面获取到的 '七牛云的CNAME'
			TTL - 默认

		是否配置成功,查看相关文档介绍

	3.使用 qshell 上传我们本地的静态文件,css、js、images等

	到此,七牛云的配置基本结束。

2>接着,开始重构 laravel 项目:
	1.刚开始也不清楚,laravel 该如何配置 CDN。我先简述下,我的项目目前的情况:
		1)项目里文件上传的地方,全部使用了 '七牛云上传',但是是硬编码的,在每个上传的地方,直接使用项目里自定义公共的七牛云上传函数,并未使用 laravel 的文件系统,这样导致的问题就是:laravel 的文件系统的配置基本无用,不论是本地、测试环境,都是上传到七牛云上了,而且给数据库上传文件,直接存储的路径就是已经添加了七牛云的域名:http://xxx/images/xxx.jpg。(可能也是因为重构外包项目,自己压根没有想这块~,正常趁这次重构了这种写法)
			$avatar = 'http://7xt4e8.com1.z0.glb.clouddn.com/uploads/2016-07/20160727151312505.png';
			<img src="{{ $avatar }}">

		2)项目中的静态文件,css、js、images,前端这套,又使用的是本地的,引用时是相对项目域名(这边可以通过 qshell 全部上传到七牛云)
			<javascript src="/js/test.js"></javascript>
			<img src="/images/test.jpg">

		3)1和2的问题,都可以解决掉,现在我们项目的静态资源和上传文件,都已经到了七牛云,我们在本地该如何引入呢?
			这次重构,会使用 laravel 的文件系统,要求本地或测试环境时,我们不一定上传到七牛云,线上环境得上传到七牛云,不同的 laravel 文件系统,如何保证静态文件和上传文件的访问,方便配置。

			thinkphp 提供了一个 '__CDN__' 的配置前缀:
				<javascript src="__CDN__/js/test.js"></javascript>
				如何是本地文件,define('__CND__', '') 即可。
				如果是七牛云文件,define('__CND__', 'http://xxx') 即可。

			而 laravel 中,发现并没有提及到任何这种配置,唯一我们在文档中,经常看到的是推荐使用 'asset()' 函数来引用前端资源。并未有 thinkphp CDN 相关的这种配置(这里我是相当困惑,是我自己哪里出问题了,还是 laravel 让我们自己来发挥)

			我想到的解决方法是:
				.env 添加配置:
					CDN=xxx

				config/custom.php 添加配置(我项目里自己添加了 custom.php 配置文件,用于项目里一些自定义的配置):
					'cdn' => env('CDN', 'http://qiniu.kissyou.com'),		// 默认给的是上面定义的 '七牛云融合 CDN' 域名

				这样,我们引入文件时,以 js 文件为例:
					<script src="{{ asset(config('custom.cdn') . 'js/jquery-1.11.2.min.js') }}"></script>

				这种写法,有点繁琐啊,给每个静态文件的引入前,都得添加 config('custom.cdn') 前缀,更好的方式是,需要我们自定义一个类似 'asset()' 的公共函数了:
					if ( !function_exists(custom_asset())) {
						function custom_asset($path, $secure = null){
							$path = config('custom.cdn') . $path;
							asset($path, $secure);	
						}
					}
					<script src="{{ custom_asset('js/jquery-1.11.2.min.js') }}"></script>

				laravel 的 Routing/UrlGenerator.php 里其实也提到了一个和 asset() 类似的方法 assetFrom():
				    /**
				     * Generate the URL to an asset from a custom root domain such as CDN, etc.
				     *
				     * @param  string  $root
				     * @param  string  $path
				     * @param  bool|null  $secure
				     * @return string
				     */
				    public function assetFrom($root, $path, $secure = null)
				    {
				        // Once we get the root URL, we will check to see if it contains an index.php
				        // file in the paths. If it does, we will remove it since it is not needed
				        // for asset paths, but only for routes to endpoints in the application.
				        $root = $this->formatRoot($this->formatScheme($secure), $root);

				        return $this->removeIndex($root).'/'.trim($path, '/');
				    }

				    介绍的是:根据一个自定义的根域名,例如 CDN 等,来生成组件的URL

				    但是,一样很麻烦,并未给我们统一的配置。还是需要我们来自定义公共的 CDN 配置(只是比 asset() 方法稍微进化了一点点):
				    	<script src="{{ URL::assetFrom(config('custom.cdn'), 'js/jquery-1.11.2.min.js') }}"></script>

				    我们也可以使用它来改造我们自定义的 custom_asset() 函数:
				    	use URL;
						if ( !function_exists(custom_asset())) {
							function custom_asset($path, $secure = null){
								URL::assetFrom(config('custom.cdn'), $path, $secure);	
							}
						}

				两种函数,我们自己选择,配置时,都需要注意点!!!(.env 和 config/custom.php 都需要注意,方法我们写的不够强健,没有处理 '', null, '/' 几个小问题,有时间了再写下)

	2.总觉得非官方的不妥,laravel 不应该不考虑这个问题啊,网上搜索相关内容,有关 laravel cdn 的包,主要有 2 个:
		vinelab/cdn
		publiux/laravelcdn(这个还是 fork 的 vinelab/cdn)

		publiux/laravelcdn 相关内容:
			github 地址:
				https://github.com/publiux/laravelcdn

			github 官网:
				http://publiux.github.io/laravelcdn/

			简单看了下文档和源码:
				laravel 的文件系统是从 laravel 5 开始引入的,而 laravelcdn 是从 laravel 4 开始的。
				laravelcdn 定义了命令 push 和 empty 命令,此外其他方法就是类似 laravel 的文件系统。
				而且,它还只支持 'aws - s3'
				最大的优点就是定义了 laravel 中未定义的 CDN 这种访问配置,几个访问配置函数:
					{{Cdn::asset('assets/js/main.js')}}
					{{Cdn::path('private/something/file.txt')}}

			总结:
				对于使用 'aws-s3' 的用户,可能还有点用。对于想切换其他 laravel 文件系统的,基本没用(而且,写法和 laravel 文件系统可能不一致,建议放弃使用!)
				如果只是为了调用静态资源和上传文件的访问,我们目前自定义函数即可,只是写的再强大点就好了!

	3.对于我当前项目中的上传,未使用 laravel 文件系统,硬编码七牛云上传的问题,进行改造:
		参考文章: 
			基于七牛云 PHP SDK + Laravel 文件存储实现 Laravel 学院静态资源云存储及 CDN 加速
			https://laravelacademy.org/post/9486.html

		扩展 laravel 文件系统,添加 '七牛云' 存储引擎,这里直接参考上述文章即可!
		添加完成后,改造项目中上传的代码。

改造的过程,放到下一篇笔记。。。

猜你喜欢

转载自blog.csdn.net/beyond__devil/article/details/83057313
今日推荐