Stripe - 支付宝支付（前端）

2、前端代码：

use \Illuminate\Support\Facades\Input;

VIP会员</p> <p> <link rel="stylesheet" type="text/css" href="<?=Config::get('app.cdn01')?>/api_assert/css/index.min.css"></p> <p> <link rel="stylesheet" type="text/css" href="<?=Config::get('app.cdn01')?>/api_assert/css/inviteReg.min.css"></p> <p> <script src="<?=Config::get('app.cdn01')?>/api_assert/script/flexible.min.js"></p> <p> #footers{</p> <p>width:100%;</p> <p> height:6rem;</p> <p> background:#fff;</p> <p> position:fixed;</p> <p> left:0;</p> <p> bottom: -.2rem;</p> <p> margin:auto;</p> <p> }</p> <p>.footers_top{</p> <p>width:100%;</p> <p> height:.9rem;</p> <p> text-align:center;</p> <p> line-height:.9rem;</p> <p> background:#fff;</p> <p> position:relative;</p> <p> display:flex;</p> <p> justify-content:center;</p> <p> align-items:center;</p> <p> }</p> <p>.footers_top span{</p> <p>font-family:"PingFang-SC-Regular";</p> <p> font-size:.34rem;</p> <p> color:#333333;</p> <p> }</p> <p>.footers_top .no_icon{</p> <p>width:.22rem;</p> <p> height:.22rem;</p> <p> position:absolute;</p> <p> right:.3rem;</p> <p> top:0;</p> <p> bottom:0;</p> <p> margin:auto;</p> <p> }</p> <p>.footers_top .no_icon img{</p> <p>display:block;</p> <p> width:100%;</p> <p> }</p> <p>.mark fade{</p> <p>width:100%;</p> <p> height:100%;</p> <p> }</p> <p>.Popup {</p> <p>display:none;</p> <p> width:100%;</p> <p> height:6rem;</p> <p> background:#fff;</p> <p> position:fixed;</p> <p> left:0;</p> <p> right:0;</p> <p> bottom:0;</p> <p> margin:auto;</p> <p> z-index:999;</p> <p> padding:.9rem .3rem 0rem;</p> <p> box-sizing:border-box;</p> <p> }</p> <p>.Popup .footers_top{</p> <p>position:absolute;</p> <p> top:0;</p> <p> left:0;</p> <p> margin:auto;</p> <p> border-bottom:1px solid #e3e3e3;</p> <p> background:#fff;</p> <p> }</p> <p>.Popup .footers_top .no_icon{</p> <p>right:.3rem;</p> <p> }</p> <p>.Popup .StripeElement {</p> <p>background-color:white;</p> <p> height:40px;</p> <p> padding:10px 12px;</p> <p> border-radius:4px;</p> <p> border:1px solid transparent;</p> <p> box-shadow:0 1px 3px 0 #e6ebf1;</p> <p> -webkit-transition:box-shadow 150ms ease;</p> <p> transition:box-shadow 150ms ease;</p> <p> }</p> <p>.Popup .StripeElement--focus {</p> <p>box-shadow:0 1px 3px 0 #cfd7df;</p> <p> }</p> <p>.Popup .StripeElement--invalid {</p> <p>border-color:#fa755a;</p> <p> }</p> <p>.Popup .StripeElement--webkit-autofill {</p> <p>background-color:#fefde5 !important;</p> <p> }</p> <p>.Popup .StripeElement {</p> <p>background-color:white;</p> <p> height:40px;</p> <p> padding:10px 12px;</p> <p> border-radius:4px;</p> <p> border:1px solid transparent;</p> <p> box-shadow:0px 0px 3px 1px #e6ebf1;</p> <p> -webkit-transition:box-shadow 150ms ease;</p> <p> transition:box-shadow 150ms ease;</p> <p> }</p> <p><body class="unheader unfooter"></p> <p><div class="header"></p> <p> <div class="header-btn"></p> <p> <div class="i-arrow" _back></p> <p> <div class="i-close" _close></p> <p> <div class="header-title">邀请注册</p> <p><div class="main" id="btn" data-message="<?=isset($ban_flag)?$ban_flag:''?>"></p> <p> <div class="step"></p> <p> <div>1.选择礼包</p> <p> <div><div class="i-arrow"></p> <p> <div>2.收货信息</p> <p> <div><div class="i-arrow"></p> <p> <div class="on">3.立即支付</p> <p> <form class="step3" action="payment/create"></p> <p> <div class="scroll"></p> <p> <label class="input-group"></p> <p> <div class="group"></p> <p> <div class="group-l nowrap"></p> <p> <button type="button" class="name">邀请人 </p> <p> <div class="group-r"></p> <p> <div class="contant"><?php echo $parent->nick_name?></p> <p> $inviteCode = \App\Models\UserInviteCode::query()->where('user_id',$parent->user_id)->where('state',1)->first();</p> <p> ?> <label class="input-group" <?php echo $inviteCode?'':'style="display:none"'?>></p> <p> <div class="group"></p> <p> <div class="group-l nowrap"></p> <p> <button type="button" class="name">邀请码 </p> <p> <div class="group-r"></p> <p> <div class="contant"></p> <p> <?php echo $inviteCode?$inviteCode->code:''; ?> </p> <p> <label class="input-group"></p> <p> <div class="group"></p> <p> <div class="group-l nowrap"></p> <p> <button type="button" class="name">联系人 </p> <p> <div class="group-r"></p> <p> <div class="contant"></p> <p> <?php echo e(Input::get('name'))?> <?php echo e(Input::get('phone'))?> </p> <p> <label class="input-group"></p> <p> <div class="group top"></p> <p> <div class="group-l nowrap"></p> <p> <button type="button" class="name">地址 </p> <p> <div class="group-r"></p> <p> <div class="contant"></p> <p> 新加坡</p> <p> <?php echo e(Input::get('address'))?> </p> <p> <div class="ware"></p> <p> <div class="group"></p> <p> $gift = \App\Models\UserUpgradeGift::query()</p> <p> ->where('state',1)</p> <p> ->where('id',Input::get('gift'))</p> <p> ->first();</p> <p> if(!$gift)</p> <p> throw new \App\Business\Exceptions\BusinessException('请选择礼包！');</p> <p> ?> <div class="group-l"></p> <p> <div class="logo"><img src="<?=$gift->pic_url?>"></p> <p> <div class="group-r"></p> <p> <div class="group right top"></p> <p> <div class="group-l"></p> <p> <div class="ware-main"></p> <p> <div class="ware-name t-o"></p> <p> <?=e($gift->goods_name)?> </p> <p> <div class="ware-spec"></p> <p> <div class="ware-price"></p> <p> <span class="now">￥<?=$gift->price?></p> <p> <span class="old v-b">￥ <?=$gift->res_price?></p> <p>--></p> <p> <div class="group-r"></p> <p> <div class="ware-count">x1</p> <p> <input type="hidden" name="parentNo" value="<?php echo e(Input::get('parentNo'))?>"></p> <p> <input type="hidden" name="type" value="<?php echo e(Input::get('hasstore'))?>"></p> <p> <input type="hidden" name="giftId" value="<?php echo e(Input::get('gift'))?>"></p> <p> <input type="hidden" name="phone" value="<?php echo e(Input::get('phone'))?>"></p> <p> <input type="hidden" name="authcode" value="<?php echo e(Input::get('authcode'))?>"></p> <p> <input type="hidden" name="name" value="<?php echo e(Input::get('name'))?>"></p> <p> <input type="hidden" name="address" value="<?php echo e(Input::get('address'))?>"></p> <p> <input type="hidden" name="business" value="UserUpgradeOrder"></p> <p> <input type="hidden" name="province" value="2"></p> <p> <input type="hidden" name="city" value="3"></p> <p> <input type="hidden" name="area" value="4"></p> <p> <input type="hidden" name="invitationCode" value="<?=$inviteCode?$inviteCode->code:''?>"></p> <p> <input type="hidden" name="zipcode" value="<?php echo e(Input::get('zipcode'))?>"></p> <p> <div class="foot"></p> <p> <div class="group right"></p> <p> <div class="group-l"></p> <p> <div class="amount"></p> <p> 共 1件商品</p> <p> <div class="f-r"></p> <p> 需支付<span class="price">S$<span id="pay_money"></span></span>元</p> <p> <div class="group-r nowrap"></p> <p> <button type="button" class="confirm">立即支付</p> <p> <div class="mark fade"></p> <p> <div class="pay-mode bounce" id="footers"></p> <p> <div class="footers_top"></p> <p> <span>支付方式</p> <p> <div class="no_icon"></p> <p> <img src="<?=Config::get('app.url')?>/ononononon.png" alt=""></p> <p> <div style="border-bottom:none"></p> <p> <label class="mode" ></p> <p> <div class="i-alipay" style="background-image:url('<?=Config::get('app.url')?>/xinyongka.png')"></p> <p> <span class="pay-name v-t">新加坡信用卡</p> <p> <div class="checkbox f-r"></p> <p> <input type="radio" name="payProvider" value="1" checked=""></p> <p> <label class="mode" ></p> <p> <div class="i-alipay"></p> <p> <span class="pay-name v-t">支付宝支付</p> <p> <div class="checkbox f-r"></p> <p> <input type="radio" name="payProvider" value="2" ></p> <p> <button type="submit" id="submitOrder" class="btn-submit" style="width:6.2rem; height:.8rem; background:#F7A030; position:absolute; left:0; right:0; margin:auto; text-align:center; line-height:.8rem; color:#FFFFFF;font-size:.3rem; font-family:'PingFang-SC-Regular'; position:absolute; bottom:.4rem; left:0; right:0; margin:auto; border-radius:.12rem;">确认支付</p> <p> <div class="Popup"></p> <p> <div class="footers_top"></p> <p> <span>支付方式</p> <p> <div class="no_icon"></p> <p> <img src="<?=Config::get('app.url')?>/ononononon.png" alt=""></p> <p> <form action="/charge" method="post" id="payment-form"></p> <p> <div class="form-row"></p> <p> <div id="card-element" style="margin-bottom:.2rem ;margin-top:.2rem"></p> <p> <label for="card-element" style=" font-family:'PingFang-SC-Regular'; color:#999999;font-size:.26rem;"></p> <p> 填写您的银行卡号确认付款</p> <p> <div id="card-errors" role="alert" style="margin-top:.2rem; font-family:'PingFang-SC-Regular'; color:#999999;font-size:.26rem;"></p> <p> <button class="button" style="width:6.2rem; height:.8rem; background:#F7A030; position:absolute; left:0; right:0; margin:auto; text-align:center; line-height:.8rem; color:#FFFFFF;font-size:.3rem; font-family:'PingFang-SC-Regular'; position:absolute; bottom:.4rem; left:0; right:0; margin:auto; border-radius:.12rem;" ></p> <p> 确认支付</p> <p><script src="<?=Config::get('app.cdn01')?>/api_assert/script/zepto.min.js"></p> <p><script src="<?=Config::get('app.cdn01')?>/api_assert/script/index.min.js"></p> <p><script src="<?=Config::get('app.cdn01')?>/api_assert/script/expand.js"></p> <p><script src="https://js.stripe.com/v3/"></p> <p> var msg =$("#btn").attr('data-message');</p> <p> if(msg){</p> <p>$("#submitOrder").css({'display':'none'});</p> <p> $(".confirm").css({'display':'none'});</p> <p> App.alert(msg);</p> <p> }</p> <p>App.ajaxWait({</p> <p>url:'<?=\Illuminate\Support\Facades\URL::to('app/userUpgrade/Money')?>',</p> <p> data:{},</p> <p> success:function(result){</p> <p>var hasstore ='<?php echo e(Input::get('hasstore'))?>';</p> <p> if(hasstore==1){</p> <p>$("#pay_money").text(result['level_1_money'])</p> <p>}else{</p> <p>$("#pay_money").text(result['level_2_money'])</p> <p>}</p> <p>}</p> <p>})</p> <p>// Create a Stripe client.</p> <p> var stripe = Stripe("<?= env('STRIPE_PUB_KEY') ?>");</p> <p> // Create an instance of Elements.</p> <p> var elements = stripe.elements();</p> <p> // Custom styling can be passed to options when creating an Element.</p> <p>// (Note that this demo uses a wider set of styles than the guide below.)</p> <p> var style = {</p> <p>base: {</p> <p>color:'#32325d',</p> <p> lineHeight:'18px',</p> <p> fontFamily:'"Helvetica Neue", Helvetica, sans-serif',</p> <p> fontSmoothing:'antialiased',</p> <p> fontSize:'16px',</p> <p> '::placeholder': {</p> <p>color:'#aab7c4'</p> <p> }</p> <p>},</p> <p> invalid: {</p> <p>color:'#fa755a',</p> <p> iconColor:'#fa755a'</p> <p> }</p> <p>};</p> <p> // Create an instance of the card Element.</p> <p> var card = elements.create('card', {style: style});</p> <p> // Add an instance of the card Element into the `card-element`</p> <p>.</p> <p> card.mount('#card-element');</p> <p> // Handle real-time validation errors from the card Element.</p> <p> card.addEventListener('change', function(event) {</p> <p>var displayError = document.getElementById('card-errors');</p> <p> if (event.error) {</p> <p>displayError.textContent = event.error.message;</p> <p> }else {</p> <p>displayError.textContent ='';</p> <p> }</p> <p>});</p> <p> // Handle form submission.</p> <p> $("#submitOrder").click((e)=>{</p> <p>e.preventDefault();</p> <p> data =$(".step3").serializeArray();</p> <p> data['pay_provider'] =1;</p> <p> let parentNo='';</p> <p> let type='';</p> <p> let giftId='';</p> <p> let phone='';</p> <p> let authcode='';</p> <p> let name='';</p> <p> let address='';</p> <p> let business='';</p> <p> let province='';</p> <p> let city='';</p> <p> let area='';</p> <p> let invitationCode='';</p> <p> let zipcode='';</p> <p> let payProvider='';</p> <p> data.forEach((val,index)=> {</p> <p>if (val.name =="parentNo") {</p> <p>parentNo = val.value;</p> <p> }</p> <p>else if (val.name =="type") {</p> <p>type = val.value;</p> <p> }</p> <p>else if (val.name =="giftId") {</p> <p>giftId = val.value;</p> <p> }</p> <p>else if (val.name =="phone") {</p> <p>phone = val.value;</p> <p> }</p> <p>else if (val.name =="authcode") {</p> <p>authcode = val.value;</p> <p> }</p> <p>else if (val.name =="name") {</p> <p>name = val.value;</p> <p> }</p> <p>else if (val.name =="address") {</p> <p>address = val.value;</p> <p> }</p> <p>else if (val.name =="business") {</p> <p>business = val.value;</p> <p> }</p> <p>else if (val.name =="province") {</p> <p>province = val.value;</p> <p> }</p> <p>else if (val.name =="city") {</p> <p>city = val.value;</p> <p> }</p> <p>else if (val.name =="area") {</p> <p>area = val.value;</p> <p> }</p> <p>else if (val.name =="invitationCode") {</p> <p>invitationCode = val.value;</p> <p> }</p> <p>else if (val.name =="zipcode") {</p> <p>zipcode = val.value;</p> <p> }</p> <p>else if (val.name =="payProvider") {</p> <p>payProvider = val.value;</p> <p> }</p> <p>})</p> <p>// 表单提交标识</p> <p> let flag =true;</p> <p> if(payProvider==1){</p> <p>$(".Popup").css({"display":"block"});</p> <p> $(".button").click((event) => {</p> <p>$(".pay-mode").hide();</p> <p> event.stopPropagation();</p> <p> event.preventDefault();</p> <p> if(flag) {</p> <p>flag =false;</p> <p> stripe.createToken(card).then((result) => {</p> <p>if (result.error) {</p> <p>// Inform the user if there was an error.</p> <p> var errorElement = document.getElementById('card-errors');</p> <p> errorElement.textContent = result.error.message;</p> <p> }</p> <p>else {</p> <p>let token = result.token.id;</p> <p> setTimeout(()=>{</p> <p>flag =true;</p> <p> }, 3000);</p> <p> App.ajaxWait({</p> <p>url:"<?=\Illuminate\Support\Facades\URL::to('app/stripe/paidGift')?>",</p> <p> type:"POST",</p> <p> data: {</p> <p>'parentNo': parentNo,</p> <p> 'type': type,</p> <p> 'giftId': giftId,</p> <p> 'phone': phone,</p> <p> 'authcode': authcode,</p> <p> 'name': name,</p> <p> 'address': address,</p> <p> 'business': business,</p> <p> 'province': province,</p> <p> 'city': city,</p> <p> 'area': area,</p> <p> 'invitationCode': invitationCode,</p> <p> 'zipcode': zipcode,</p> <p> 'payProvider': payProvider,</p> <p> 'currency':"sgd",</p> <p> 'amount':"398",</p> <p> 'pay_type':2,</p> <p> 'source': token</p> <p>},</p> <p> success:function (res) {</p> <p>App.alert('支付成功！优品质、享购物、趣赚钱，即刻下载app吧！', function () {</p> <p>window.location.href ='/app/download';</p> <p> });</p> <p> flag =true;</p> <p> // if (!res.data) {</p> <p>//</p> <p>// }</p> <p>// else {</p> <p> // App.alert(res && res.err_desc ? res.err_desc : '支付失败');</p> <p>// }</p> <p> }</p> <p>})</p> <p>}</p> <p>});</p> <p> }</p> <p>})</p> <p>}</p> <p>else if(payProvider==2){</p> <p>App.ajaxWait({</p> <p>url:"xxxxxxxxx/app/stripe/createWebOrd",</p> <p> type:"POST",</p> <p> data: {</p> <p>'parentNo': parentNo,</p> <p> 'type': type,</p> <p> 'giftId': giftId,</p> <p> 'phone': phone,</p> <p> 'authcode': authcode,</p> <p> 'name': name,</p> <p> 'address': address,</p> <p> 'business': business,</p> <p> 'province': province,</p> <p> 'city': city,</p> <p> 'area': area,</p> <p> 'invitationCode': invitationCode,</p> <p> 'zipcode': zipcode,</p> <p> 'payProvider': payProvider,</p> <p> 'currency':"sgd",</p> <p> 'amount':"398",</p> <p> 'pay_type':2</p> <p> },</p> <p> success:function (res) {</p> <p>if (res.order_id) {</p> <p>function alipay(amount) {</p> <p>stripe.createSource({</p> <p>type:'alipay',</p> <p> amount:parseInt(amount),</p> <p> currency:'sgd', // usd, eur, ***</p> <p> redirect: {</p> <p>return_url: res['return_url']</p> <p>},</p> <p> metadata: {</p> <p>'order_sn':res['trade_no'],</p> <p> 'order_id':res['order_id'],</p> <p> 'amount':amount,</p> <p> 'business':res['business'],</p> <p> // 'ordered_at':res['created_at']</p> <p> },</p> <p> }).then(function (response) {</p> <p>if (response.error) {</p> <p>alert(response.error.message);</p> <p> }</p> <p>else {</p> <p>console.log(response);</p> <p> processStripeResponse(response.source);</p> <p> }</p> <p>});</p> <p> }</p> <p>function processStripeResponse(source) {</p> <p>window.location.href = source.redirect.url;</p> <p> }</p> <p>alipay(res['amount']);</p> <p> }</p> <p>else {</p> <p>App.alert(res && res.err_desc ? res.err_desc :'支付失败');</p> <p> }</p> <p>}</p> <p>})</p> <p>}</p> <p>});</p> <p> $(".confirm").click(function (e) {</p> <p>e.preventDefault();</p> <p> showPay();</p> <p> });</p> <p> $(".mark").click(function (e) {</p> <p>e.preventDefault();</p> <p> hidePay();</p> <p> });</p> <p> $(".no_icon").click((e)=>{</p> <p>e.preventDefault();</p> <p> hidePay();</p> <p> });</p> <p> function showPay() {</p> <p>// $(".pay-mode").hide();</p> <p> $(".pay-mode").show();</p> <p> $(".mark").show();</p> <p> }</p> <p>function hidePay() {</p> <p>$(".pay-mode").hide();</p> <p> $(".mark").hide();</p> <p> $(".Popup").css({'display':'none'});</p> <p> }</p> </article> </div> </div> </div>  <div id="SOHUCS" sid="1700183199956676608"></div> <script type="text/javascript" src="/views/front/js/chanyan.js"></script>  <div class="youdao-fixed-ad" id="detail_ad_bottom"></div> </div> <div class="col-md-3"> <div class="row" id="ad">  <div id="right-1" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad"> <div class="youdao-fixed-ad" id="detail_ad_1"> </div> </div>  <div id="right-2" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad"> <div class="youdao-fixed-ad" id="detail_ad_2"></div> </div>  <div id="right-3" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad"> <div class="youdao-fixed-ad" id="detail_ad_3"></div> </div> </div> </div> </div> </div> </div> <div class="container"> <h4 class="pt20 mb15 mt0 border-top">你可能感兴趣的:(Stripe - 支付宝支付（前端）)</h4> <div id="paradigm-article-related"> <div class="recommend-post mb30"> <ul class="widget-links"> <li><a href="/article/1892474879861649408.htm" title="探索 TypeScript Redux：构建大规模JavaScript应用的终极指南" target="_blank">探索 TypeScript Redux：构建大规模JavaScript应用的终极指南</a> <span class="text-muted">柳旖岭</span> <div>探索TypeScriptRedux：构建大规模JavaScript应用的终极指南去发现同类优质开源项目:https://gitcode.com/在当今快速发展的前端开发领域中，组合正确工具集来应对复杂性和扩展性挑战至关重要。今天，我们将深入了解一个令人兴奋的开源项目——TypeScriptRedux，它结合了TypeScript、JSPM、typings、React和Redux的强大功能，为开发者</div> </li> <li><a href="/article/1892471976795107328.htm" title="前端导出word文件—包含canvas(echarts图表)" target="_blank">前端导出word文件—包含canvas(echarts图表)</a> <span class="text-muted">Liuer_Qin</span> <a class="tag" taget="_blank" href="/search/js/1.htm">js</a><a class="tag" taget="_blank" href="/search/canvas/1.htm">canvas</a><a class="tag" taget="_blank" href="/search/echarts/1.htm">echarts</a><a class="tag" taget="_blank" href="/search/echarts/1.htm">echarts</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a> <div>一、使用的插件html-docx-js二、整体思路因为canvas是运行在内存中的，所以不能简单的通过dom获取canvas图片，需要手动的先将canvas转为image。三、实现先克隆要下载的DOM的副本。因为canvas是运行在内存中的，所以也不能通过cloneNode方法克隆下来（克隆下来是空的）。我们这里将原DOM中的canvas转成图片，然后插入到副本的对应位置，这样操作不会影响原DOM</div> </li> <li><a href="/article/1892433617058066432.htm" title="使用Odoo Shell卸载模块" target="_blank">使用Odoo Shell卸载模块</a> <span class="text-muted">odoo中国</span> <a class="tag" taget="_blank" href="/search/odoo/1.htm">odoo</a><a class="tag" taget="_blank" href="/search/odoo/1.htm">odoo</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E6%BA%90%E8%BD%AF%E4%BB%B6/1.htm">开源软件</a><a class="tag" taget="_blank" href="/search/erp/1.htm">erp</a> <div>使用OdooShell卸载模块我们在Odoo使用过程中，因为模块安装错误或者前端错误等导致odoo无法通过界面登录，这时候你可以使用OdooShell来卸载模块。OdooShell是一个交互式Pythonshell，允许你直接与Odoo数据库和模型进行交互。以下是使用OdooShell卸载模块的详细步骤：步骤1：启动OdooShell要启动OdooShell，你需要在终端中运行以下命令。确保你已经</div> </li> <li><a href="/article/1892426166254497792.htm" title="基于 Spring Boot 的社区居民健康管理系统部署说明书" target="_blank">基于 Spring Boot 的社区居民健康管理系统部署说明书</a> <span class="text-muted">小星袁</span> <a class="tag" taget="_blank" href="/search/%E6%AF%95%E4%B8%9A%E8%AE%BE%E8%AE%A1%E5%8E%9F%E6%96%87/1.htm">毕业设计原文</a><a class="tag" taget="_blank" href="/search/spring/1.htm">spring</a><a class="tag" taget="_blank" href="/search/boot/1.htm">boot</a><a class="tag" taget="_blank" href="/search/%E5%90%8E%E7%AB%AF/1.htm">后端</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a> <div>目录1系统概述2准备资料3系统安装与部署3.1数据库部署3.1.1MySQL的部署3.1.2Navicat的部署3.2服务器部署3.3客户端部署4系统配置与优化5其他基于SpringBoot的社区居民健康管理系统部署说明书1系统概述本系统主要运用了SpringBoot框架，前端页面的设计主要依托Vue框架来构建，实现丰富且交互性强的用户界面，后台管理功能则采用SpringBoot框架与MySQL数</div> </li> <li><a href="/article/1892407882675187712.htm" title="前端性能优化——如何提高页面加载速度？" target="_blank">前端性能优化——如何提高页面加载速度？</a> <span class="text-muted">忘川...</span> <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/%E6%80%A7%E8%83%BD%E4%BC%98%E5%8C%96/1.htm">性能优化</a><a class="tag" taget="_blank" href="/search/html/1.htm">html</a> <div>1.将样式表放在头部首先说明一下，将样式表放在头部对于实际页面加载的时间并不能造成太大影响，但是这会减少页面首屏出现的时间，使页面内容逐步呈现，改善用户体验，防止“白屏”。我们总是希望页面能够尽快显示内容，为用户提供可视化的回馈，这对网速慢的用户来说是很重要的。将样式表放在文档底部会阻止浏览器中的内容逐步出现。为了避免当样式变化时重绘页面元素，浏览器会阻塞内容逐步呈现，造成“白屏”。这源自浏览器的</div> </li> <li><a href="/article/1892407376435277824.htm" title="前端开发入门指南：HTML、CSS和JavaScript基础知识" target="_blank">前端开发入门指南：HTML、CSS和JavaScript基础知识</a> <span class="text-muted">方向感超强的</span> <a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/css/1.htm">css</a><a class="tag" taget="_blank" href="/search/html/1.htm">html</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>引言：大家好，我是一名简单的前端开发爱好者，对于网页设计和用户体验的追求让我深深着迷。在本篇文章中，我将带领大家探索前端开发的基础知识，涵盖HTML、CSS和JavaScript。如果你对这个领域感兴趣，或者想要了解如何开始学习前端开发，那么这篇文章将为你提供一个良好的起点。1.前端开发概述在我们深入了解前端开发的细节之前，让我们先了解一下前端开发的定义和作用。简而言之，前端开发涉及构建用户直接与</div> </li> <li><a href="/article/1892404729082867712.htm" title="前端504错误分析" target="_blank">前端504错误分析</a> <span class="text-muted">ox0080</span> <a class="tag" taget="_blank" href="/search/%23/1.htm">#</a><a class="tag" taget="_blank" href="/search/%E5%8C%97%E6%BC%82%2B%E6%BB%B4%E6%BB%B4%E5%87%BA%E8%A1%8C/1.htm">北漂+滴滴出行</a><a class="tag" taget="_blank" href="/search/Web/1.htm">Web</a><a class="tag" taget="_blank" href="/search/VIP/1.htm">VIP</a><a class="tag" taget="_blank" href="/search/%E6%BF%80%E5%8A%B1/1.htm">激励</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>前端出现504错误（网关超时）通常是由于代理服务器未能及时从上游服务获取响应。以下是详细分析步骤和解决方案：1.确认错误来源504含义：代理服务器（如Nginx、Apache）在等待后端服务响应时超时。常见架构：前端→代理服务器→后端服务，问题通常出在代理与后端之间。2.排查步骤（1）检查后端服务状态确认服务是否运行：通过日志或监控工具（如systemctlstatus,KubernetesPod</div> </li> <li><a href="/article/1892398803407925248.htm" title="部署前端项目2" target="_blank">部署前端项目2</a> <span class="text-muted">augenstern416</span> <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>前端项目的部署是将开发完成的前端代码发布到服务器或云平台，使其能够通过互联网访问。以下是前端项目部署的常见步骤和工具：1.准备工作在部署之前，确保项目已经完成以下步骤：代码优化：压缩JavaScript、CSS和图片文件，减少文件体积。环境配置：区分开发环境和生产环境（如API地址、环境变量等）。测试：确保项目在本地测试通过，没有明显Bug。2.部署流程1.构建项目大多数前端项目（如React、V</div> </li> <li><a href="/article/1892398677004185600.htm" title="对象的操作" target="_blank">对象的操作</a> <span class="text-muted">augenstern416</span> <a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a><a class="tag" taget="_blank" href="/search/ecmascript/1.htm">ecmascript</a> <div>在前端开发中，JavaScript提供了许多内置对象和方法，用于处理数据、操作DOM、处理事件等。以下是一些常用对象及其方法和扩展技巧：1.Object对象Object是JavaScript中最基础的对象，几乎所有对象都继承自Object。常用方法Object.keys(obj)：返回对象的所有可枚举属性的键名数组。constobj={a:1,b:2};console.log(Object.key</div> </li> <li><a href="/article/1892390738520502272.htm" title="前端基础入门：HTML、CSS 和 JavaScript" target="_blank">前端基础入门：HTML、CSS 和 JavaScript</a> <span class="text-muted">阿绵</span> <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/html/1.htm">html</a><a class="tag" taget="_blank" href="/search/css/1.htm">css</a><a class="tag" taget="_blank" href="/search/js/1.htm">js</a> <div>在现代网页开发中，前端技术扮演着至关重要的角色。无论是个人网站、企业官网，还是复杂的Web应用程序，前端开发的基础技术HTML、CSS和JavaScript都是每个开发者必须掌握的核心技能。本文将详细介绍这三者的基本概念及其应用一、HTML——网页的骨架HTML（HyperTextMarkupLanguage）是构建网页的基础语言。它是网页的结构和内容的标记语言，决定了网页上的文本、图像、表单等元</div> </li> <li><a href="/article/1892360084474884096.htm" title="前端超长列表，虚拟滚动实现" target="_blank">前端超长列表，虚拟滚动实现</a> <span class="text-muted">大橙子-</span> <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/css/1.htm">css</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a> <div>虚拟滚动.container{width:300px;height:500px;overflow:hidden;border:1pxsolid#ccc;margin-top:50px;}.scroll-box{width:100%;height:100%;overflow-y:auto;overflow-x:hidden;position:relative;}.scroll-height-main</div> </li> <li><a href="/article/1892346975152566272.htm" title="前端框架虚拟DOM的产生" target="_blank">前端框架虚拟DOM的产生</a> <span class="text-muted">大橙子-</span> <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF%E6%A1%86%E6%9E%B6/1.htm">前端框架</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a> <div>直接说结论：为了找出与命令式(原生实现步骤)所执行代码的最小差异化，从而优化代码性能。命令式：可以理解为面向过程编程，需要写好每个实现步骤constdiv=document.querySelector('#app')//获取divdiv.innerText='helloworld'//设置文本内容如果需要修改文字内容为“你好”div.innerText='你好'//设置文本内容声明式：可以理解为面</div> </li> <li><a href="/article/1892336006464598016.htm" title="27岁大龄转码秋招惨败，朋友劝我转Java来得及吗？还是继续走前端或机器学习？" target="_blank">27岁大龄转码秋招惨败，朋友劝我转Java来得及吗？还是继续走前端或机器学习？</a> <span class="text-muted">程序员yt</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E6%9C%BA%E5%99%A8%E5%AD%A6%E4%B9%A0/1.htm">机器学习</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a> <div>今天给大家分享的是一位粉丝的提问，27岁大龄转码秋招惨败，朋友劝我转Java来得及吗？还是继续走前端或机器学习？接下来把粉丝的具体提问和我的回复分享给大家，希望也能给一些类似情况的小伙伴一些启发和帮助。同学提问：211建筑本科，22年毕业后gap一年转码去了英国读的QS100的it的水硕（24年12月份毕业），转码后对就业形势认知不足，时间全花在课业上，八股文和算法准备的不充足，秋招算是惨败。读研</div> </li> <li><a href="/article/1892301695560511488.htm" title="芯麦GC1808立体声ADC芯片解析：高性价比与全集成音频采集方案" target="_blank">芯麦GC1808立体声ADC芯片解析：高性价比与全集成音频采集方案</a> <span class="text-muted">青牛科技-Allen</span> <a class="tag" taget="_blank" href="/search/GLOBALCHIP/1.htm">GLOBALCHIP</a><a class="tag" taget="_blank" href="/search/%E9%9F%B3%E8%A7%86%E9%A2%91/1.htm">音视频</a><a class="tag" taget="_blank" href="/search/%E5%8D%95%E7%89%87%E6%9C%BA/1.htm">单片机</a><a class="tag" taget="_blank" href="/search/%E5%B5%8C%E5%85%A5%E5%BC%8F%E7%A1%AC%E4%BB%B6/1.htm">嵌入式硬件</a><a class="tag" taget="_blank" href="/search/%E6%94%B6%E5%BD%95%E6%9C%BA/1.htm">收录机</a><a class="tag" taget="_blank" href="/search/%E4%BA%BA%E5%B7%A5%E6%99%BA%E8%83%BD/1.htm">人工智能</a><a class="tag" taget="_blank" href="/search/%E5%AE%B6%E7%94%A8%E7%94%B5%E5%99%A8/1.htm">家用电器</a> <div>引言在直播设备、智能语音终端等新兴应用的推动下，高性能音频采集系统的需求持续增长。芯麦半导体推出的GC1808立体声音频模数转换器，凭借其全集成信号链设计和灵活的接口配置，为开发者提供了高性价比的音频前端解决方案。本文将从核心架构、关键技术特性及典型应用场景三个方面，深入解析这款芯片的设计亮点。一、GC1808核心特性概览全集成信号链内置64倍过采样率Δ-Σ调制器集成数字梳状滤波器（CombFil</div> </li> <li><a href="/article/1892296529092341760.htm" title="前端面试题（HTML篇）" target="_blank">前端面试题（HTML篇）</a> <span class="text-muted">每天一点点~</span> <a class="tag" taget="_blank" href="/search/html/1.htm">html</a><a class="tag" taget="_blank" href="/search/css/1.htm">css</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a> <div>1.网络中使用最多的图片格式有哪些？JPEG，GIF，PNG最流行的是JPEG格式，可以把文件压缩到最小在PS以JPEG格式存储时，提供11级压缩等级2.Doctype作用?严格模式与混杂模式如何区分？它们有何意义?声明文档类型声明位于位于HTML文档中的第一行，处于标签之前DOCTYPE不存在或格式不正确会导致文档以兼容模式呈现。标准模式(严格模式)浏览器按照W3C的标准解析执行代码标准模式(严</div> </li> <li><a href="/article/1892296149751099392.htm" title="python websocket 心跳_websocket心跳及重连机制" target="_blank">python websocket 心跳_websocket心跳及重连机制</a> <span class="text-muted">蜗牛老湿</span> <a class="tag" taget="_blank" href="/search/python/1.htm">python</a><a class="tag" taget="_blank" href="/search/websocket/1.htm">websocket</a><a class="tag" taget="_blank" href="/search/%E5%BF%83%E8%B7%B3/1.htm">心跳</a> <div>websocket心跳及重连机制websocket是前后端交互的长连接，前后端也都可能因为一些情况导致连接失效并且相互之间没有反馈提醒。因此为了保证连接的可持续性和稳定性，websocket心跳重连就应运而生。在使用原生websocket的时候，如果设备网络断开，不会立刻触发websocket的任何事件，前端也就无法得知当前连接是否已经断开。这个时候如果调用websocket.send方法，浏览器</div> </li> <li><a href="/article/1892267275638075392.htm" title="electron学习笔记" target="_blank">electron学习笔记</a> <span class="text-muted">weixin_46452138</span> <a class="tag" taget="_blank" href="/search/electron/1.htm">electron</a><a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0/1.htm">学习</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a> <div>electron个人学习笔记一、electron简单了解Electron是一个跨平台的、基于Web前端技术的桌面GUI应用程序开发框架。可以使用HTML、CSS来绘制界面和控制布局，使用JavaScript来控制用户行为和业务逻辑，使用Node.js来通信、处理音频视频等，几乎所有的Web前端技术和框架（jQuery、Vue、React、Angular等）都可以应用到桌面GUI开发中。二、开发前基</div> </li> <li><a href="/article/1892256681367236608.htm" title="虚拟DOM和真实DOM的区别" target="_blank">虚拟DOM和真实DOM的区别</a> <span class="text-muted">水煮庄周鱼鱼</span> <a class="tag" taget="_blank" href="/search/%E6%A6%82%E5%BF%B5/1.htm">概念</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>虚拟DOM（VirtualDOM）、DOM（RealDOM）是前端开发中常用的两种概念。什么是真实DOM？真实DOM是浏览器中实际存在的DOM结构，它由浏览器解析HTML生成，并且直接与浏览器交互。当页面中的数据发生变化时，真实DOM会重新计算布局和渲染，这个过程比较耗费性能。什么是虚拟DOM?虚拟DOM是一种在内存中以JavaScript对象的形式表示的轻量级的DOM结构。它是对真实DOM的一种</div> </li> <li><a href="/article/1892243161523220480.htm" title="Java开发实习面试笔试题（含答案）" target="_blank">Java开发实习面试笔试题（含答案）</a> <span class="text-muted">小钊（求职中）</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E9%9D%A2%E8%AF%95/1.htm">面试</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a><a class="tag" taget="_blank" href="/search/spring/1.htm">spring</a><a class="tag" taget="_blank" href="/search/spring/1.htm">spring</a><a class="tag" taget="_blank" href="/search/boot/1.htm">boot</a><a class="tag" taget="_blank" href="/search/maven/1.htm">maven</a><a class="tag" taget="_blank" href="/search/tomcat/1.htm">tomcat</a> <div>在广州一家中大公司面试（BOSS标注是1000-9999人，薪资2-3k），招聘上写着Java开发，基本没有标注前端要求，但是到场知道是前后端分离人不分离。开始先让你做笔试（12道问答+4道SQL题），接着面试也是八股文之类的，没有问项目，没有做算法，现分享笔试和面试题目给大家做参考。（基础的没复习忘了不会，只会几道感觉已经寄了，最重要的是前端基本不会）一、笔试内容1.Java有哪些数据类型，什么</div> </li> <li><a href="/article/1892225886195871744.htm" title="鸿蒙5.0实战案例：关于图像撕裂、掉帧等异常现象的原理以及优化方案" target="_blank">鸿蒙5.0实战案例：关于图像撕裂、掉帧等异常现象的原理以及优化方案</a> <span class="text-muted">敢嗣先锋</span> <a class="tag" taget="_blank" href="/search/%E9%B8%BF%E8%92%99%E5%BC%80%E5%8F%91/1.htm">鸿蒙开发</a><a class="tag" taget="_blank" href="/search/HarmonyOS/1.htm">HarmonyOS</a><a class="tag" taget="_blank" href="/search/%E7%A7%BB%E5%8A%A8%E5%BC%80%E5%8F%91/1.htm">移动开发</a><a class="tag" taget="_blank" href="/search/harmonyos/1.htm">harmonyos</a><a class="tag" taget="_blank" href="/search/%E9%B8%BF%E8%92%99%E5%BC%80%E5%8F%91/1.htm">鸿蒙开发</a><a class="tag" taget="_blank" href="/search/openharmony/1.htm">openharmony</a><a class="tag" taget="_blank" href="/search/%E7%A7%BB%E5%8A%A8%E5%BC%80%E5%8F%91/1.htm">移动开发</a><a class="tag" taget="_blank" href="/search/ArkUI/1.htm">ArkUI</a><a class="tag" taget="_blank" href="/search/%E6%80%A7%E8%83%BD%E4%BC%98%E5%8C%96/1.htm">性能优化</a> <div>往期推文全新看点（文中附带全新鸿蒙5.0全栈学习笔录）✏️鸿蒙（HarmonyOS）北向开发知识点记录~✏️鸿蒙（OpenHarmony）南向开发保姆级知识点汇总~✏️鸿蒙应用开发与鸿蒙系统开发哪个更有前景？✏️嵌入式开发适不适合做鸿蒙南向开发？看完这篇你就了解了~✏️对于大前端开发来说，转鸿蒙开发究竟是福还是祸？✏️鸿蒙岗位需求突增！移动端、PC端、IoT到底该怎么选？✏️记录一场鸿蒙开发岗位面</div> </li> <li><a href="/article/1892219834280767488.htm" title="【如何实现 JavaScript 的防抖和节流？】" target="_blank">【如何实现 JavaScript 的防抖和节流？】</a> <span class="text-muted">程序员远仔</span> <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF%E9%9D%A2%E8%AF%95%E9%AB%98%E9%A2%91%E9%97%AE%E9%A2%98%E5%AE%9D%E5%85%B8/1.htm">前端面试高频问题宝典</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/vue.js/1.htm">vue.js</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF%E6%A1%86%E6%9E%B6/1.htm">前端框架</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/html5/1.htm">html5</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a> <div>如何实现JavaScript的防抖和节流？前言防抖（Debounce）和节流（Throttle）是JavaScript中优化高频事件处理的两种常用技术。它们可以有效减少事件处理函数的调用次数，提升性能并改善用户体验。本文将详细介绍防抖和节流的实现原理及其应用场景。关键词JavaScript、防抖、节流、高频事件、性能优化、事件处理、前端开发、前端面试、前端基础、前端进阶、前端工程化、前端开发最佳实</div> </li> <li><a href="/article/1892214793360699392.htm" title="Web开发中的可专利性分析：透过一个案例学习" target="_blank">Web开发中的可专利性分析：透过一个案例学习</a> <span class="text-muted">CodePatentMaster</span> <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0/1.htm">学习</a> <div>Web开发工程师在创新过程中经常面临是否能申请专利并获得专利权的问题。本文通过一个详细的Web开发领域案例来阐释可专利性的分析过程。案例分析假设您是一名Web开发工程师，您开发了一种名为“动态响应式前端框架”（DynamicResponsiveFrontendFramework，DRFF）的新型前端框架。与传统前端框架相比，DRFF通过引入一种基于AI的组件化设计方法和实时数据流处理机制，显著提高</div> </li> <li><a href="/article/1892209750993596416.htm" title="前端实现防抖功能的详细解读" target="_blank">前端实现防抖功能的详细解读</a> <span class="text-muted">黑码小帅</span> <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF%E7%9F%A5%E8%AF%86%E6%80%BB%E7%BB%93/1.htm">前端知识总结</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/vue.js/1.htm">vue.js</a><a class="tag" taget="_blank" href="/search/vue/1.htm">vue</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/ajax/1.htm">ajax</a><a class="tag" taget="_blank" href="/search/easyui/1.htm">easyui</a><a class="tag" taget="_blank" href="/search/bootstrap/1.htm">bootstrap</a> <div>在前端开发中，防抖（Debounce）是一种优化技术，用于限制某个函数在短时间内被频繁调用的次数。它的核心思想是：在一定时间内，无论触发多少次事件，只执行最后一次操作。防抖通常用于处理用户输入、窗口调整、滚动事件等高频触发的场景，以减少不必要的计算或请求，提升性能。1.防抖的应用场景常见场景搜索框输入：当用户在搜索框中输入内容时，每次按键都会触发搜索请求。如果不做防抖处理，可能会导致大量不必要的请</div> </li> <li><a href="/article/1892206853664862208.htm" title="前端 window.print() 打印图片" target="_blank">前端 window.print() 打印图片</a> <span class="text-muted">BillKu</span> <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>在使用document.write时，确保内容加载完成后再执行其他操作（如print），可以通过以下方法实现：1.使用window.onload事件window.onload事件会在页面所有资源（包括图片、脚本等）加载完成后触发。javascript复制window.onload=function(){document.write("页面已加载完成");window.print();//确保内容加</div> </li> <li><a href="/article/1892163473534676992.htm" title="Svelte 5 框架加速实时应用开发, 或引领未来前端编译式框架大爆发?" target="_blank">Svelte 5 框架加速实时应用开发, 或引领未来前端编译式框架大爆发?</a> <span class="text-muted">寒鸦xxx</span> <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF%E5%89%8D%E6%B2%BF%E6%8A%80%E6%9C%AF/1.htm">前端前沿技术</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF%E6%A1%86%E6%9E%B6/1.htm">前端框架</a> <div>自从去年Svelte团队发布了Svelte5稳定版，同样也是该项目历史上最重要的版本,目前start已经上升到了80K+,也有越来越多的企业和项目投入了该生态.下面我们来看看它与众不同的几大点一、为何Svelte5能加速实时应用？响应式系统的革命细粒度更新：通过$state和$derived实现精准依赖追踪，仅更新受影响的UI部分（而非虚拟DOM全量比对）。性能对比：在实时数据流场景（如股票行情）</div> </li> <li><a href="/article/1892159186607861760.htm" title="TypeScript 中的 type 和 interface：你真的了解它们的不同吗？" target="_blank">TypeScript 中的 type 和 interface：你真的了解它们的不同吗？</a> <span class="text-muted">液态不合群</span> <a class="tag" taget="_blank" href="/search/typescript/1.htm">typescript</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>如果你有写过Vue3的项目，那么对TypeScript肯定不会陌生。不管是公司新项目技术选型还是个人学习开发新的前端项目，Vue3+TypeScript已经成为首选技术方案之一在TypeScript这个强大的静态类型系统中，type和interface是两个重要的关键字，用于定义和描述数据类型。然而，这两者之间的区别是什么，在实际开发过程中我们要怎么用呢？废话不说，直接进入正题，就让我们一起深入探</div> </li> <li><a href="/article/1892140785311215616.htm" title="ollama-chat-ui-vue，一个可以用vue对接ollama的开源项目,可接入deepSeek" target="_blank">ollama-chat-ui-vue，一个可以用vue对接ollama的开源项目,可接入deepSeek</a> <span class="text-muted">是你的小熊啊</span> <a class="tag" taget="_blank" href="/search/ui/1.htm">ui</a><a class="tag" taget="_blank" href="/search/vue.js/1.htm">vue.js</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/ai/1.htm">ai</a> <div>ollama-chat-ui-vue使用vue3+vite+elementUi搭建的前端chat,通过ollama可与模型对话,目前支持独立思考,切换模型(联网查询后续支持)github地址：ollama-chat-ui-vue制作不易github点点star，谢谢前置工作安装ollama,ollama官网地址安装完ollama后，打开cmd，下载模型(我选了个最小的模型，模型地址)ollamar</div> </li> <li><a href="/article/1892139021031763968.htm" title="HTML5的新增标签有哪些？" target="_blank">HTML5的新增标签有哪些？</a> <span class="text-muted">「已注销」</span> <a class="tag" taget="_blank" href="/search/HTML5/1.htm">HTML5</a> <div>2019-07-3009:46我们都知道，想要成为一名合格的前端开发人员，掌握好HTML5是一个重要的先决条件，相比较于HTML，HTML5中新增了许多功能标签，那么这么标签都有哪些呢？格式：定义文本的文本方向，使其脱离其周围文本的方向设置。定义有记号的文本。定义预定义范围内的度量。定义任何类型的任务的进度。定义若浏览器不支持ruby元素显示的内容。定义ruby注释的解释。定义ruby注释。定义日</div> </li> <li><a href="/article/1892138264207355904.htm" title="1 html5-新标签" target="_blank">1 html5-新标签</a> <span class="text-muted">xiaolongyu3</span> <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF%E6%96%B0%E5%AD%A6/1.htm">前端新学</a><a class="tag" taget="_blank" href="/search/html5/1.htm">html5</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/html/1.htm">html</a> <div>年龄稍大一点的码农可能见证了html的发展，亲历了头声明的变化，但是现在起步就是html5,那么html有哪些不为大家常用的新东西呢，这一章我先来谈谈这个问题。1dialog标签——弹窗标签。弹窗可能前端一路走来，见过很多。甚至现在我们在用各种UI库的时候这个弹窗也是必须的一个功能。这个标签支持的api:show:展示弹窗框，采用决定定位，showModal:展示弹窗，并带有遮罩，采用了一个特殊的</div> </li> <li><a href="/article/1892132588710064128.htm" title="HTML5+CSS3【容器元素、 HTML5新增布局标签、视频和音频、HTML5新增标签】(五)-全面详解（学习总结---从入门到深化）" target="_blank">HTML5+CSS3【容器元素、 HTML5新增布局标签、视频和音频、HTML5新增标签】(五)-全面详解（学习总结---从入门到深化）</a> <span class="text-muted">童小纯</span> <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF%E7%B3%BB%E5%88%97---%E4%BB%8E%E5%85%A5%E9%97%A8%E5%88%B0%E6%B7%B1%E5%8C%96/1.htm">前端系列---从入门到深化</a><a class="tag" taget="_blank" href="/search/css3/1.htm">css3</a><a class="tag" taget="_blank" href="/search/html5/1.htm">html5</a> <div>作者简介：大家好，我是小童，Java开发工程师，CSDN博客博主，Java领域新星创作者系列专栏：前端、Java、Java中间件大全、微信小程序、微信支付、若依框架、Spring全家桶如果文章知识点有错误的地方，请指正！和大家一起学习，一起进步如果感觉博主的文章还不错的话，请三连支持一下博主哦博主正在努力完成2023计划中：以梦为马，扬帆起航，2023追梦人目录容器元素（div）学习效果反馈HTM</div> </li> <li><a href="/article/77.htm" title="算法单链的创建与删除" target="_blank">算法单链的创建与删除</a> <span class="text-muted">换个号韩国红果果</span> <a class="tag" taget="_blank" href="/search/c/1.htm">c</a><a class="tag" taget="_blank" href="/search/%E7%AE%97%E6%B3%95/1.htm">算法</a> <div> 先创建结构体 struct student { int data; //int tag;//标记这是第几个 struct student *next; }; // addone 用于将一个数插入已从小到大排好序的链中 struct student *addone(struct student *h,int x){ if(h==NULL) //?????? </div> </li> <li><a href="/article/204.htm" title="《大型网站系统与Java中间件实践》第2章读后感" target="_blank">《大型网站系统与Java中间件实践》第2章读后感</a> <span class="text-muted">白糖_</span> <a class="tag" taget="_blank" href="/search/java%E4%B8%AD%E9%97%B4%E4%BB%B6/1.htm">java中间件</a> <div> 断断续续花了两天时间试读了《大型网站系统与Java中间件实践》的第2章，这章总述了从一个小型单机构建的网站发展到大型网站的演化过程---整个过程会遇到很多困难，但每一个屏障都会有解决方案，最终就是依靠这些个解决方案汇聚到一起组成了一个健壮稳定高效的大型系统。看完整章内容，</div> </li> <li><a href="/article/331.htm" title="zeus持久层spring事务单元测试" target="_blank">zeus持久层spring事务单元测试</a> <span class="text-muted">deng520159</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/DAO/1.htm">DAO</a><a class="tag" taget="_blank" href="/search/spring/1.htm">spring</a><a class="tag" taget="_blank" href="/search/jdbc/1.htm">jdbc</a> <div>今天把zeus事务单元测试放出来,让大家指出他的毛病, 1.ZeusTransactionTest.java 单元测试 package com.dengliang.zeus.webdemo.test; import java.util.ArrayList; import java.util.List; import org.junit.Test; import </div> </li> <li><a href="/article/458.htm" title="Rss 订阅开发" target="_blank">Rss 订阅开发</a> <span class="text-muted">周凡杨</span> <a class="tag" taget="_blank" href="/search/html/1.htm">html</a><a class="tag" taget="_blank" href="/search/xml/1.htm">xml</a><a class="tag" taget="_blank" href="/search/%E8%AE%A2%E9%98%85/1.htm">订阅</a><a class="tag" taget="_blank" href="/search/rss/1.htm">rss</a><a class="tag" taget="_blank" href="/search/%E8%A7%84%E8%8C%83/1.htm">规范</a> <div> RSS是 Really Simple Syndication的缩写（对rss2.0而言，是这三个词的缩写，对rss1.0而言则是RDF Site Summary的缩写，1.0与2.0走的是两个体系）。 RSS</div> </li> <li><a href="/article/585.htm" title="分页查询实现" target="_blank">分页查询实现</a> <span class="text-muted">g21121</span> <a class="tag" taget="_blank" href="/search/%E5%88%86%E9%A1%B5%E6%9F%A5%E8%AF%A2/1.htm">分页查询</a> <div>在查询列表时我们常常会用到分页，分页的好处就是减少数据交换，每次查询一定数量减少数据库压力等等。按实现形式分前台分页和服务器分页：前台分页就是一次查询出所有记录，在页面中用js进行虚拟分页，这种形式在数据量较小时优势比较明显，一次加载就不必再访问服务器了，但当数据量较大时会对页面造成压力，传输速度也会大幅下降。服务器分页就是每次请求相同数量记录，按一定规则排序，每次取一定序号直接的数据</div> </li> <li><a href="/article/712.htm" title="spring jms异步消息处理" target="_blank">spring jms异步消息处理</a> <span class="text-muted">510888780</span> <a class="tag" taget="_blank" href="/search/jms/1.htm">jms</a> <div>spring JMS对于异步消息处理基本上只需配置下就能进行高效的处理。其核心就是消息侦听器容器，常用的类就是DefaultMessageListenerContainer。该容器可配置侦听器的并发数量，以及配合MessageListenerAdapter使用消息驱动POJO进行消息处理。且消息驱动POJO是放入TaskExecutor中进行处理，进一步提高性能，减少侦听器的阻塞。具体配置如下： </div> </li> <li><a href="/article/839.htm" title="highCharts柱状图" target="_blank">highCharts柱状图</a> <span class="text-muted">布衣凌宇</span> <a class="tag" taget="_blank" href="/search/hightCharts/1.htm">hightCharts</a><a class="tag" taget="_blank" href="/search/%E6%9F%B1%E5%9B%BE/1.htm">柱图</a> <div>第一步：导入 exporting.js,grid.js,highcharts.js;第二步：写controller @Controller@RequestMapping(value="${adminPath}/statistick")public class StatistickController { private UserServi</div> </li> <li><a href="/article/966.htm" title="我的spring学习笔记2-IoC（反向控制依赖注入）" target="_blank">我的spring学习笔记2-IoC（反向控制依赖注入）</a> <span class="text-muted">aijuans</span> <a class="tag" taget="_blank" href="/search/spring/1.htm">spring</a><a class="tag" taget="_blank" href="/search/mvc/1.htm">mvc</a><a class="tag" taget="_blank" href="/search/Spring+%E6%95%99%E7%A8%8B/1.htm">Spring 教程</a><a class="tag" taget="_blank" href="/search/spring3+%E6%95%99%E7%A8%8B/1.htm">spring3 教程</a><a class="tag" taget="_blank" href="/search/Spring+%E5%85%A5%E9%97%A8/1.htm">Spring 入门</a> <div>IoC（反向控制依赖注入）这是Spring提出来了，这也是Spring一大特色。这里我不用多说，我们看Spring教程就可以了解。当然我们不用Spring也可以用IoC，下面我将介绍不用Spring的IoC。 IoC不是框架，她是java的技术，如今大多数轻量级的容器都会用到IoC技术。这里我就用一个例子来说明：如：程序中有 Mysql.calss 、Oracle.class 、SqlSe</div> </li> <li><a href="/article/1093.htm" title="TLS java简单实现" target="_blank">TLS java简单实现</a> <span class="text-muted">antlove</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/ssl/1.htm">ssl</a><a class="tag" taget="_blank" href="/search/keystore/1.htm">keystore</a><a class="tag" taget="_blank" href="/search/tls/1.htm">tls</a><a class="tag" taget="_blank" href="/search/secure/1.htm">secure</a> <div> 1. SSLServer.java package ssl; import java.io.FileInputStream; import java.io.InputStream; import java.net.ServerSocket; import java.net.Socket; import java.security.KeyStore; import </div> </li> <li><a href="/article/1220.htm" title="Zip解压压缩文件" target="_blank">Zip解压压缩文件</a> <span class="text-muted">百合不是茶</span> <a class="tag" taget="_blank" href="/search/Zip%E6%A0%BC%E5%BC%8F%E8%A7%A3%E5%8E%8B/1.htm">Zip格式解压</a><a class="tag" taget="_blank" href="/search/Zip%E6%B5%81%E7%9A%84%E4%BD%BF%E7%94%A8/1.htm">Zip流的使用</a><a class="tag" taget="_blank" href="/search/%E6%96%87%E4%BB%B6%E8%A7%A3%E5%8E%8B/1.htm">文件解压</a> <div> ZIP文件的解压缩实质上就是从输入流中读取数据。Java.util.zip包提供了类ZipInputStream来读取ZIP文件,下面的代码段创建了一个输入流来读取ZIP格式的文件; ZipInputStream in = new ZipInputStream(new FileInputStream(zipFileName)); &n</div> </li> <li><a href="/article/1347.htm" title="underscore.js 学习（一）" target="_blank">underscore.js 学习（一）</a> <span class="text-muted">bijian1013</span> <a class="tag" taget="_blank" href="/search/JavaScript/1.htm">JavaScript</a><a class="tag" taget="_blank" href="/search/underscore/1.htm">underscore</a> <div> 工作中需要用到underscore.js，发现这是一个包括了很多基本功能函数的js库，里面有很多实用的函数。而且它没有扩展 javascript的原生对象。主要涉及对Collection、Object、Array、Function的操作。学</div> </li> <li><a href="/article/1474.htm" title="java jvm常用命令工具——jstatd命令(Java Statistics Monitoring Daemon)" target="_blank">java jvm常用命令工具——jstatd命令(Java Statistics Monitoring Daemon)</a> <span class="text-muted">bijian1013</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/jvm/1.htm">jvm</a><a class="tag" taget="_blank" href="/search/jstatd/1.htm">jstatd</a> <div>1.介绍 jstatd是一个基于RMI（Remove Method Invocation）的服务程序，它用于监控基于HotSpot的JVM中资源的创建及销毁，并且提供了一个远程接口允许远程的监控工具连接到本地的JVM执行命令。 jstatd是基于RMI的，所以在运行jstatd的服务</div> </li> <li><a href="/article/1601.htm" title="【Spring框架三】Spring常用注解之Transactional" target="_blank">【Spring框架三】Spring常用注解之Transactional</a> <span class="text-muted">bit1129</span> <a class="tag" taget="_blank" href="/search/transactional/1.htm">transactional</a> <div>Spring可以通过注解@Transactional来为业务逻辑层的方法(调用DAO完成持久化动作)添加事务能力，如下是@Transactional注解的定义： /* * Copyright 2002-2010 the original author or authors. * * Licensed under the Apache License, Version </div> </li> <li><a href="/article/1728.htm" title="我(程序员)的前进方向" target="_blank">我(程序员)的前进方向</a> <span class="text-muted">bitray</span> <a class="tag" taget="_blank" href="/search/%E7%A8%8B%E5%BA%8F%E5%91%98/1.htm">程序员</a> <div>作为一个普通的程序员,我一直游走在java语言中,java也确实让我有了很多的体会.不过随着学习的深入,java语言的新技术产生的越来越多,从最初期的javase,我逐渐开始转变到ssh,ssi,这种主流的码农,.过了几天为了解决新问题,webservice的大旗也被我祭出来了,又过了些日子jms架构的activemq也开始必须学习了.再后来开始了一系列技术学习,osgi,restful.....</div> </li> <li><a href="/article/1855.htm" title="nginx lua开发经验总结" target="_blank">nginx lua开发经验总结</a> <span class="text-muted">ronin47</span> <div>使用nginx lua已经两三个月了，项目接开发完毕了，这几天准备上线并且跟高德地图对接。回顾下来lua在项目中占得必中还是比较大的，跟PHP的占比差不多持平了，因此在开发中遇到一些问题备忘一下 1：content_by_lua中代码容量有限制，一般不要写太多代码，正常编写代码一般在100行左右（具体容量没有细心测哈哈，在4kb左右），如果超出了则重启nginx的时候会报 too long pa</div> </li> <li><a href="/article/1982.htm" title="java-66-用递归颠倒一个栈。例如输入栈{1,2,3,4,5}，1在栈顶。颠倒之后的栈为{5,4,3,2,1}，5处在栈顶" target="_blank">java-66-用递归颠倒一个栈。例如输入栈{1,2,3,4,5}，1在栈顶。颠倒之后的栈为{5,4,3,2,1}，5处在栈顶</a> <span class="text-muted">bylijinnan</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a> <div> import java.util.Stack; public class ReverseStackRecursive { /** * Q 66.颠倒栈。 * 题目：用递归颠倒一个栈。例如输入栈{1,2,3,4,5}，1在栈顶。 * 颠倒之后的栈为{5,4,3,2,1}，5处在栈顶。 *1. Pop the top element *2. Revers</div> </li> <li><a href="/article/2109.htm" title="正确理解Linux内存占用过高的问题" target="_blank">正确理解Linux内存占用过高的问题</a> <span class="text-muted">cfyme</span> <a class="tag" taget="_blank" href="/search/linux/1.htm">linux</a> <div>Linux开机后，使用top命令查看，4G物理内存发现已使用的多大3.2G，占用率高达80%以上： Mem: 3889836k total, 3341868k used, 547968k free, 286044k buffers Swap: 6127608k total,&nb</div> </li> <li><a href="/article/2236.htm" title="[JWFD开源工作流]当前流程引擎设计的一个急需解决的问题" target="_blank">[JWFD开源工作流]当前流程引擎设计的一个急需解决的问题</a> <span class="text-muted">comsci</span> <a class="tag" taget="_blank" href="/search/%E5%B7%A5%E4%BD%9C%E6%B5%81/1.htm">工作流</a> <div> 当我们的流程引擎进入IRC阶段的时候，当循环反馈模型出现之后，每次循环都会导致一大堆节点内存数据残留在系统内存中，循环的次数越多，这些残留数据将导致系统内存溢出，并使得引擎崩溃。。。。。。而解决办法就是利用汇编语言或者其它系统编程语言，在引擎运行时，把这些残留数据清除掉。</div> </li> <li><a href="/article/2363.htm" title="自定义类的equals函数" target="_blank">自定义类的equals函数</a> <span class="text-muted">dai_lm</span> <a class="tag" taget="_blank" href="/search/equals/1.htm">equals</a> <div>仅作笔记使用 public class VectorQueue { private final Vector<VectorItem> queue; private class VectorItem { private final Object item; private final int quantity; public VectorI</div> </li> <li><a href="/article/2490.htm" title="Linux下安装R语言" target="_blank">Linux下安装R语言</a> <span class="text-muted">datageek</span> <a class="tag" taget="_blank" href="/search/R%E8%AF%AD%E8%A8%80+linux/1.htm">R语言 linux</a> <div>命令如下：sudo gedit /etc/apt/sources.list1、deb http://mirrors.ustc.edu.cn/CRAN/bin/linux/ubuntu/ precise/ 2、deb http://dk.archive.ubuntu.com/ubuntu hardy universesudo apt-key adv --keyserver ke</div> </li> <li><a href="/article/2617.htm" title="如何修改mysql 并发数(连接数)最大值" target="_blank">如何修改mysql 并发数(连接数)最大值</a> <span class="text-muted">dcj3sjt126com</span> <a class="tag" taget="_blank" href="/search/mysql/1.htm">mysql</a> <div>MySQL的连接数最大值跟MySQL没关系，主要看系统和业务逻辑了方法一：进入MYSQL安装目录打开MYSQL配置文件 my.ini 或 my.cnf查找 max_connections=100 修改为 max_connections=1000 服务里重起MYSQL即可　　方法二：MySQL的最大连接数默认是100客户端登录：mysql -uusername -ppass</div> </li> <li><a href="/article/2744.htm" title="单一功能原则" target="_blank">单一功能原则</a> <span class="text-muted">dcj3sjt126com</span> <a class="tag" taget="_blank" href="/search/%E9%9D%A2%E5%90%91%E5%AF%B9%E8%B1%A1%E7%9A%84%E7%A8%8B%E5%BA%8F%E8%AE%BE%E8%AE%A1/1.htm">面向对象的程序设计</a><a class="tag" taget="_blank" href="/search/%E8%BD%AF%E4%BB%B6%E8%AE%BE%E8%AE%A1/1.htm">软件设计</a><a class="tag" taget="_blank" href="/search/%E7%BC%96%E7%A8%8B%E5%8E%9F%E5%88%99/1.htm">编程原则</a> <div>单一功能原则[ 编辑] SOLID 原则单一功能原则开闭原则 Liskov代换原则接口隔离原则依赖反转原则查论编在面向对象编程领域中，单一功能原则（Single responsibility principle）规定每个类都应该有</div> </li> <li><a href="/article/2871.htm" title="POJO、VO和JavaBean区别和联系" target="_blank">POJO、VO和JavaBean区别和联系</a> <span class="text-muted">fanmingxing</span> <a class="tag" taget="_blank" href="/search/VO/1.htm">VO</a><a class="tag" taget="_blank" href="/search/POJO/1.htm">POJO</a><a class="tag" taget="_blank" href="/search/javabean/1.htm">javabean</a> <div>POJO和JavaBean是我们常见的两个关键字，一般容易混淆，POJO全称是Plain Ordinary Java Object / Plain Old Java Object，中文可以翻译成：普通Java类，具有一部分getter/setter方法的那种类就可以称作POJO，但是JavaBean则比POJO复杂很多，JavaBean是一种组件技术，就好像你做了一个扳子，而这个扳子会在很多地方被</div> </li> <li><a href="/article/2998.htm" title="SpringSecurity3.X--LDAP：AD配置" target="_blank">SpringSecurity3.X--LDAP：AD配置</a> <span class="text-muted">hanqunfeng</span> <a class="tag" taget="_blank" href="/search/SpringSecurity/1.htm">SpringSecurity</a> <div>前面介绍过基于本地数据库验证的方式，参考http://hanqunfeng.iteye.com/blog/1155226，这里说一下如何修改为使用AD进行身份验证【只对用户名和密码进行验证，权限依旧存储在本地数据库中】。将配置文件中的如下部分删除：  </div> </li> <li><a href="/article/3125.htm" title="mac mysql 修改密码" target="_blank">mac mysql 修改密码</a> <span class="text-muted">IXHONG</span> <a class="tag" taget="_blank" href="/search/mysql/1.htm">mysql</a> <div>$ sudo /usr/local/mysql/bin/mysqld_safe –user=root & //启动MySQL(也可以通过偏好设置面板来启动)$ sudo /usr/local/mysql/bin/mysqladmin -uroot password yourpassword //设置MySQL密码（注意，这是第一次MySQL密码为空的时候的设置命令，如果是修改密码，还需在-</div> </li> <li><a href="/article/3252.htm" title="设计模式--抽象工厂模式" target="_blank">设计模式--抽象工厂模式</a> <span class="text-muted">kerryg</span> <a class="tag" taget="_blank" href="/search/%E8%AE%BE%E8%AE%A1%E6%A8%A1%E5%BC%8F/1.htm">设计模式</a> <div>抽象工厂模式：工厂模式有一个问题就是，类的创建依赖于工厂类，也就是说，如果想要拓展程序，必须对工厂类进行修改，这违背了闭包原则。我们采用抽象工厂模式，创建多个工厂类，这样一旦需要增加新的功能，直接增加新的工厂类就可以了，不需要修改之前的代码。总结：这个模式的好处就是，如果想增加一个功能，就需要做一个实现类，</div> </li> <li><a href="/article/3379.htm" title="评"高中女生军训期跳楼”" target="_blank">评"高中女生军训期跳楼”</a> <span class="text-muted">nannan408</span> <div> 首先，先抛出我的观点，各位看官少点砖头。那就是，中国的差异化教育必须做起来。孔圣人有云：有教无类。不同类型的人，都应该有对应的教育方法。目前中国的一体化教育，不知道已经扼杀了多少创造性人才。我们出不了爱迪生，出不了爱因斯坦，很大原因，是我们的培养思路错了，我们是第一要“顺从”。如果不顺从，我们的学校，就会用各种方法，罚站，罚写作业，各种罚。军</div> </li> <li><a href="/article/3506.htm" title="scala如何读取和写入文件内容？" target="_blank">scala如何读取和写入文件内容？</a> <span class="text-muted">qindongliang1922</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/jvm/1.htm">jvm</a><a class="tag" taget="_blank" href="/search/scala/1.htm">scala</a> <div>直接看如下代码： package file import java.io.RandomAccessFile import java.nio.charset.Charset import scala.io.Source import scala.reflect.io.{File, Path} /** * Created by qindongliang on 2015/</div> </li> <li><a href="/article/3633.htm" title="C语言算法之百元买百鸡" target="_blank">C语言算法之百元买百鸡</a> <span class="text-muted">qiufeihu</span> <a class="tag" taget="_blank" href="/search/c/1.htm">c</a><a class="tag" taget="_blank" href="/search/%E7%AE%97%E6%B3%95/1.htm">算法</a> <div>中国古代数学家张丘建在他的《算经》中提出了一个著名的“百钱买百鸡问题”，鸡翁一，值钱五，鸡母一，值钱三，鸡雏三，值钱一，百钱买百鸡，问翁，母，雏各几何？代码如下： #include <stdio.h> int main() { int cock,hen,chick; /*定义变量为基本整型*/ for(coc</div> </li> <li><a href="/article/3760.htm" title="Hadoop集群安全性：Hadoop中Namenode单点故障的解决方案及详细介绍AvatarNode" target="_blank">Hadoop集群安全性：Hadoop中Namenode单点故障的解决方案及详细介绍AvatarNode</a> <span class="text-muted">wyz2009107220</span> <a class="tag" taget="_blank" href="/search/NameNode/1.htm">NameNode</a> <div>正如大家所知，NameNode在Hadoop系统中存在单点故障问题，这个对于标榜高可用性的Hadoop来说一直是个软肋。本文讨论一下为了解决这个问题而存在的几个solution。 1. Secondary NameNode 原理：Secondary NN会定期的从NN中读取editlog，与自己存储的Image进行合并形成新的metadata image 优点：Hadoop较早的版本都自带，</div> </li> </ul> </div> </div> </div> <div> <div class="container"> <div class="indexes"> <strong>按字母分类：</strong> <a href="/tags/A/1.htm" target="_blank">A</a><a href="/tags/B/1.htm" target="_blank">B</a><a href="/tags/C/1.htm" target="_blank">C</a><a href="/tags/D/1.htm" target="_blank">D</a><a href="/tags/E/1.htm" target="_blank">E</a><a href="/tags/F/1.htm" target="_blank">F</a><a href="/tags/G/1.htm" target="_blank">G</a><a href="/tags/H/1.htm" target="_blank">H</a><a href="/tags/I/1.htm" target="_blank">I</a><a href="/tags/J/1.htm" target="_blank">J</a><a href="/tags/K/1.htm" target="_blank">K</a><a href="/tags/L/1.htm" target="_blank">L</a><a href="/tags/M/1.htm" target="_blank">M</a><a href="/tags/N/1.htm" target="_blank">N</a><a href="/tags/O/1.htm" target="_blank">O</a><a href="/tags/P/1.htm" target="_blank">P</a><a href="/tags/Q/1.htm" target="_blank">Q</a><a href="/tags/R/1.htm" target="_blank">R</a><a href="/tags/S/1.htm" target="_blank">S</a><a href="/tags/T/1.htm" target="_blank">T</a><a href="/tags/U/1.htm" target="_blank">U</a><a href="/tags/V/1.htm" target="_blank">V</a><a href="/tags/W/1.htm" target="_blank">W</a><a href="/tags/X/1.htm" target="_blank">X</a><a href="/tags/Y/1.htm" target="_blank">Y</a><a href="/tags/Z/1.htm" target="_blank">Z</a><a href="/tags/0/1.htm" target="_blank">其他</a> </div> </div> </div> <footer id="footer" class="mb30 mt30"> <div class="container"> <div class="footBglm"> <a target="_blank" href="/">首页</a> - <a target="_blank" href="/custom/about.htm">关于我们</a> - <a target="_blank" href="/search/Java/1.htm">站内搜索</a> - <a target="_blank" href="/sitemap.txt">Sitemap</a> - <a target="_blank" href="/custom/delete.htm">侵权投诉</a> </div> <div class="copyright">版权所有 IT知识库 CopyRight © 2000-2050 E-COM-NET.COM , All Rights Reserved.  </div> </div> </footer>  <script type="text/javascript" src="/static/syntaxhighlighter/scripts/shCore.js"></script> <script type="text/javascript" src="/static/syntaxhighlighter/scripts/shLegacy.js"></script> <script type="text/javascript" src="/static/syntaxhighlighter/scripts/shAutoloader.js"></script> <link type="text/css" rel="stylesheet" href="/static/syntaxhighlighter/styles/shCoreDefault.css"/> <script type="text/javascript" src="/static/syntaxhighlighter/src/my_start_1.js"></script> </body> </html>